<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="jquery-1.11.1.min.js"></script>
    <script>
        $(function(){
            $("#btnGet").click(function(){
                //val()：获取文本框的值
                var textName = $("#textName").val();
                console.log(textName);
            })

            $("#optGet").click(function(){
                var option = $("#selGet").val();
                console.log(option);
            })

            $("#btnSet").click(function(){
                $("#textName").val("设置文本框内容");
            })

            $("#GetText").click(function () {

                //text():获取文本内容，不包括html标签
                var text = $("#divText").text();
                console.log(text);
            })

            $("#SetText").click(function(){
                //text():有参数，表示设置内容，会先移除指定元素中内容，然后把新内容添加上去
                //$("#divText").text("这是设置的新的内容");

                //如果传入的是HTML结构的字符串，则会按照文本内容输出
                $("#divText").text("<span>span标签内容</span>");

            })
        })
    </script>
</head>
<body>
  <input type="button" value="获取值" id="btnGet">
  <input type="button" value="设置值" id="btnSet">
  <input type="text" id="textName">
  <input type="button" value="获取下拉框的值" id="optGet">
  <select id="selGet">
      <option value="1">1111</option>
      <option value="2">2222</option>
  </select>

  <br><br>
  <input type="button" id="GetText" value="获取文本内容"></input>
  <input type="button" id="SetText" value="设置文本内容"></input>
  <div id="divText">
      这是一个div
      <span>span中的内容</span>
      <p>p标签中的内容</p>
  </div>
</body>
</html>